import { mapGetters } from "vuex"
export const mixins = {
    props: ["index"],
    computed: {
        //内容页样式--背景图
        contentStyle() {
            return {
                background: "url(" + this.contentItem[this.index].bgImg + ") 0 0/100% 100%"
            }
        },
        //每页意象
        imageriesIndex() {
            let imageriesList = [],
                explainList = []
            //遍历意象数组 获取eryPage为当前页面索引的意象
            this.imageries.map(item => {
                if (item.eryPage - 1 === this.index) {
                    imageriesList.push(item)
                    explainList.push(item.explain)
                }
            })
            return {
                imageries: imageriesList,
                explain: explainList
            }
        },
        //每页角色
        rolesIndex() {
            //遍历角色数组 获取eryPage为当前页面索引的角色
            return this.roles.filter(item => { return item.rolePage - 1 === this.index })
        },
        //每页对话
        dialogueIndex() {
            let dialoguesList = []
            //遍历角色数组 获取eryPage为当前页面索引的角色
            for (let i = 0, len = this.roles.length; i < len; i++) {
                if (this.roles[i].rolePage - 1 === this.index && this.roles[i].dialogueContext) {
                    const context = JSON.parse(this.roles[i].dialogueContext)
                    for (let j = 0, len = context.contents.length; j < len; j++) {
                        dialoguesList.push({
                            width: this.roles[i].dialogWidth,
                            height: this.roles[i].dialogHeight,
                            left: this.roles[i].dialogLeft,
                            top: this.roles[i].dialogTop,
                            background: this.roles[i].roleAvatarUrl,
                            content: context.contents[j],
                            audioUrls: context.audioUrls[j],
                            serialNumbers: context.serialNumbers[j]
                        })
                    }
                }
            }
            return dialoguesList
        },
        ...mapGetters("contentStatus", {
            contentItem: "getContentItem",
            contentIndex: "getContentIndex"
        }),
        ...mapGetters("imageryStatus", {
            imageries: "getImageryItem"
        }),
        ...mapGetters("roleStatus", {
            roles: "getRoleItem"
        })
    },
}